<template>
  <h3>Child...</h3>
  <p>{{ count }}</p>
  <button @click="handleClick">按钮</button>
</template>

<script lang="ts">
export default {
  name: "Child",
  // props: ["count"],
  // props: {
  //   count: Number,
  // },
  props: {
    count: {
      type: Number,
      required: true,
      // default 默认值
      // validate(val) { return val > 0 && val < 18 }
    },
    update: {
      type: Function,
      required: true,
    },
  },
  methods: {
    handleClick() {
      // props是只读的，不能直接修改
      // 数据源在哪，更新数据的方法就定义在哪？
      // this.count++;
      this.update();
    },
  },
};
</script>

<style></style>
